<template>
	<div>
		 <el-button type="success" @click="dialogVisible=true">添加</el-button>
		 <hr/>
		
		
		
		<el-table :data="tableData" style="width: 100%">
			
			<el-table-column prop="name" label="姓名" width="180">
		 </el-table-column>
			<el-table-column prop="address" label="地址">
			</el-table-column>
		</el-table>
		
		
		<el-dialog
		  title="提示"
		  :visible.sync="dialogVisible" width="800px"
		  :close-on-click-modal="false"
		  :close-on-press-escape="false"
		  >
		  
		<el-form ref="form" :model="form" label-width="200px">
		  <el-form-item label="教师的名字">
		    <el-input v-model="form.name"></el-input>
		  </el-form-item>
		 
			<el-form-item label="教师的年龄">
			  <el-input v-model="form.address"></el-input>
			</el-form-item>
		 
		 
		  <el-form-item>
		    <el-button type="primary" @click="addTeacher()" >立即创建</el-button>
		  
		  </el-form-item>
		</el-form>
		  
		  
		</el-dialog>
		
		
	</div>
</template>

<script>
	//
	export default {
		name:'TeacherList',
		data(){
			return {
				dialogVisible:false,
				form:{
					name:'',
					address:''
				},
				tableData: [{
					
					name: '王小虎',
					address: '上海市普陀区金沙江路 1518 弄'
				}]
			}
		},
		methods:{
			addTeacher(){
				//拿到老师的数据  调用后端的Java程序保存导数据
				
				//重新查询，曾了一条
				this.tableData.push(this.form);
				
				//关闭对话框
				this.dialogVisible = false
			}
		}
	}
	
</script>

<style>
</style>
